<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>01 定时器</title>
</head>
<body>
    <input type="button" value="停止" id="btn">
    <input type="button" value="继续" id="btn2">
    <input type="button" value="拆炸弹" id="btn3">
</body>
<script>
    /*
        定时器：
            * 闹钟型：setInterval(函数,时间) :时间的单位是毫秒数,1秒==1000毫秒; clearInterval(timer);关闭定时器
            * 炸弹型：setTimeOut(函数,时间)，clearTimeout(timer2)，关闭定时器
    */

    //闹钟型：setInterval(函数,时间)
    var num = 0;
    function show() {//有名函数
        console.log('打印数字：' + num);
        num++;
    }
    var timer = setInterval(show, 1000);//开启定时器：循环，注意：第一次执行时间，等待5秒
    // setInterval('show()', 1000);//开启定时器：循环，注意：第一次执行时间，等待5秒

    // setInterval(function() {
    //     console.log('打印数字：' + num);
    //     num++;
    // }, 1000); //匿名函数

    var btn = document.getElementById('btn');
    var btn2 = document.getElementById('btn2');
    var btn3 = document.getElementById('btn3');

    btn.onclick = function() {
        clearInterval(timer);//关闭定时器
    }

    btn2.onclick = function() {
        timer = setInterval(show, 1000);
    }


    //炸弹型：setTimeOut(函数,时间) :执行一次

    var timer2 = setTimeout(function() {
        document.write('炸了');
    },5000);

    btn3.onclick = function() {
       clearTimeout(timer2);//在时间到之前，清除定时器
    }
</script>
</html>